<template>
  <div class="box">
    <!-- 如果当前是修改分类，则不显示上级分类此标签 -->
    <div class="box-item" v-if="!enableUpdate">
      <div>上级分类<span class="category-name" v-if="!enableAdd">{{routerVal.labelName}}</span><span class="category-name" v-else> 顶级分类</span></div>
    </div>
    <div class="flex box-item">
      <div>分类名称</div>
      <div>
        <u-input :custom-style="inputStyle" v-model="categoryName"></u-input>
      </div>
    </div>
    <div class="box-item flex">
      <div>排序值</div>
      <div>
        <u-number-box :min="0" v-model="sortOrder"></u-number-box>
      </div>
    </div>
    <div class="submit" @click="submit">{{enableUpdate ? '修改' : '添加'}}</div>
  </div>
</template>

<script>
import { addShopGoodsLabel, editShopGoodsLabel } from "@/api/shops";
export default {
  data() {
    return {
      enableUpdate: false,
      enableAdd: false,
      routerVal: "",
      categoryName: "", //分类名称
      sortOrder: 1,
      inputStyle: {
        background: "#f7f7f7",
        "padding-left": "20rpx",
        "border-radius": "10rpx",
      },
      parentId: "",
    };
  },
  onLoad(options) {
    if (options.add) {
      // 添加顶级分类判断
      this.enableAdd = true;
      console.log(this.enableAdd);
    } else {
      this.routerVal = JSON.parse(decodeURIComponent(options.data));
    }
    if (options.update) {
      // 修改判断
      this.enableUpdate = options.update;
      this.categoryName = this.routerVal.labelName;
      this.sortOrder = this.routerVal.sortOrder;
      this.parentId = options.id;
    }
  },
  methods: {
    async submit() {
      if (!this.categoryName) {
        uni.showToast({
          title: "请填写分类信息",
          icon: "none",
          duration: 2000,
        });
        return false;
      }

      uni.showLoading({
        title: "加载中",
        mask: "true",
      });
      let data = {
        parentId: this.routerVal.id,
        labelName: this.categoryName,
        sortOrder: this.sortOrder,
        level: 1,
      };
      // 修改分类
      if (this.enableUpdate) {
        data.parentId = this.parentId;
        data.id = this.routerVal.id;
        let res = await editShopGoodsLabel(data);
        if (res.data.success) {
          uni.showToast({
            title: "修改成功!",
            duration: 2000,
            icon: "none",
          });
          uni.navigateBack();
        }
      } else if (this.enableAdd) {
        // 添加分类
        data.parentId = 0;
        data.level = 0;
        this.addCategory(data);
      } else {
        this.addCategory(data);
      }
    },

    async addCategory(data) {
      // 添加二级分类
      let res = await addShopGoodsLabel(data);
      if (res.data.success) {
        uni.showToast({
          title: "添加成功!",
          duration: 2000,
          icon: "none",
        });
        uni.navigateBack();
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.box {
  padding: 32rpx;
}
.box-item {
  margin: 40rpx 0;
  > div {
    margin: 0 10rpx;
  }
}
.flex {
  align-items: center;
}
.category-name {
  margin-left: 20rpx;
}
</style>